<template>
    <div>
        <a-card title="学生信息" style="width: 100%">
            <!-- <template #extra> <a-button type="primary" @click="open = true">添加学生</a-button></template> -->
            <a-table :dataSource="dataSource" :columns="columns">
                <!-- <template #operation="{ record }">
                    <a-button style="margin-right: 10px;" type="primary" @click="editCourse(record)">编辑</a-button>
                    <a-button type="primary" danger @click="showConfirmDelete(record)">删除</a-button>
                </template> -->
            </a-table>
        </a-card>
    </div>
</template>
<script setup>
import { ref, onMounted } from 'vue'
import student from '../../api/student.js'
const columns = ref([
    {
        title: '学号',
        dataIndex: 'studentNo',
    },
    {
        title: '名字',
        dataIndex: 'studentName',
    },
    {
        title: '年龄',
        dataIndex: 'age'
    },
    {
        title: '性别',
        dataIndex: 'sex',
    },
    {
        title: '手机号',
        dataIndex: 'phone',
    },
    {
        title: '创建时间',
        dataIndex: 'gmtCreate',
    },
    {
        title: '修改时间',
        dataIndex: 'gmtModified',
    }
]);

const dataSource = ref([])

const getAllStudent = async () => {
    const res = await student.getAllStudent()
    dataSource.value = res.data.list
    // 日期处理
    dataSource.value.map(obj => {
        let dateCreate = new Date(obj.gmtCreate);
        let dateModified = new Date(obj.gmtModified);
        obj.gmtCreate = dateCreate.toLocaleString(); // 使用toLocaleString方法可以得到本地化的日期字符串  
        obj.gmtModified = dateModified.toLocaleString();
        return obj;
    })
}

onMounted(() => {
    getAllStudent()
})
</script>